// pages/search/search.js

/*
1. 输入框绑定 值改变事件 input事件
    1. 获取输入框的值
    2.合法性判断
    3.检验通过 把输入框 的值发送后台
    4.返回相应的值即可
2.防抖 （防止抖动） 定时器   节流
    0 防抖 一般 输入框 防止重复输入 重读发送请求
    1.节流 一般是用在页面的上拉和下拉
    1.定义全局的定时器id
*/
import { request } from "../../request/index.js";
import regeneratorRuntime from "../../lib/runtime/runtime";
Page({
  /**
   * 页面的初始数据
   */
  data: {
    goods: [],
    // 取消的按钮是否显示
    isFocus: false,
    // 输入框的值
    inpValue: "",
  },
  // 给防抖定时器设定一个初始值
  TimeId: -1,

  // 输入框的值进行改变就会触发的值
  handleInput(e) {
    // console.log(e);
    // 1.获取输入框的值
    const { value } = e.detail;
    // console.log(value);
    // 2.检查合法性
    if (!value.trim()) {
      this.setData({
        goods: [],
        isFocus: false,
      });
      // 值不合法
      return;
    }
    this.setData({
      isFocus: true,
    });
    // 3.发送请求获取相应的值
    // 清除上一个定时器
    clearTimeout(this.TimeId);
    // 重新开启定时器，并在1秒后执行其中的函数表达式
    this.TimeId = setTimeout(() => {
      this.qsearch(value);
    }, 1000);
  },

  // 发送请求获取搜索建议
  async qsearch(query) {
    const res = await request({
      url: "/goods/search",
      data: { query },
    });
    // console.log(res);
    // console.log(res.goods);
    this.setData({
      goods: res.goods,
    });
  },

  // 点击取消按钮需要做的事
  handleCancel() {
    this.setData({
      inpValue: "",
      isFocus: false,
      goods: [],
    });
  },
});
